<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8"/>
    <title>义务教育报告生成平台</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    {% load static %}
    <link rel="stylesheet" href="{% static 'css/index.css' %}">
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="flex min-h-screen bg-gray-100">

<!-- 左侧导航栏 -->
<aside class="w-64 bg-white border-r border-gray-200 flex flex-col">
    <div class="p-6 text-xl font-bold text-indigo-700 border-b">义务教育报告生成系统</div>
    <div class="flex items-center space-x-2 p-4 bg-indigo-50 border-b border-indigo-100">
        <svg class="w-5 h-5 text-indigo-600" fill="none" stroke="currentColor" stroke-width="2"
             viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round"
                  d="M5.121 17.804A13.937 13.937 0 0112 15c2.89 0 5.564.915 7.879 2.461M15 10a3 3 0 11-6 0 3 3 0 016 0z"/>
        </svg>
        <span class="text-sm text-indigo-700 font-medium">欢迎您，用户 {{ name }}</span>
    </div>
    <nav class="flex-1 p-4 space-y-2">
        <button onclick="loadPage('/index/main/')" class="w-full text-left px-4 py-2 rounded hover:bg-indigo-100">
            报告生成
        </button>
        <button onclick="loadPage('/index/user/')" class="w-full text-left px-4 py-2 rounded hover:bg-indigo-100">
            信息管理
        </button>
        <button onclick="loadPage('/index/change_pwd/')" class="w-full text-left px-4 py-2 rounded hover:bg-indigo-100">
            修改密码
        </button>
        <button onclick="loadPage('/index/user_manage/')" class="w-full text-left px-4 py-2 rounded hover:bg-indigo-100">
            用户管理
        </button>
    </nav>
    <!-- 登出按钮 -->
    <div class="p-4">
        <button onclick="logout()" class="w-full text-left px-4 py-2 rounded text-gray-600 hover:text-red-600 text-center">
            登出
        </button>
    </div>
    <footer class="p-4 text-xs text-gray-400 text-center border-t">© 2025 义务教育报告生成平台</footer>
</aside>

<!-- 主内容区域 -->
<main class="flex-1 overflow-auto p-4 bg-gray-50">
    <iframe id="mainFrame" src="{% url 'welcome' %}" class="w-full h-full min-h-screen border-none"></iframe>
</main>

<!-- 页面加载逻辑 -->
{% load static %}
<script src="{% static 'script/index.js' %}">
</script>
</body>
</html>
